<template>
	<view>
		<view class="header">
			<image src="@/static/zuo.png" mode="" style="width: 45upx;height: 45upx;" @click="back"></image>
			<text style="font-size: 36upx;margin-left: 30upx;color: #333;">教育经历</text>
			<!-- <text style="font-size: 36upx;margin-left: 400upx;color: #333;" @click="queding">确定</text> -->
		</view>
		<view class="list" style="padding-top: 80px;">
			<view class="items" style="display: flex;justify-content: flex-start;" @click="toxuexiao">
				<view class="list-z">
					<view class="" style="display: flex;justify-content: flex-start;">
						<text style="font-size: 26upx;color:#666666;">学校</text>
					</view>
					<view style="color: #333333;font-size: 30upx;">
						<input type="text" v-model="xuexiao" placeholder="请输入" style="font-size: 30upx;"
							disabled="false" />
					</view>
				</view>
				<image src="../../../static/tuo.png" mode="" style="width: 28upx;height: 28upx;padding-right: 0upx;">
				</image>

			</view>
		</view>
		<view class="list">
			<text style="color: #999;font-size: 26upx;">最高学历</text>
			<picker @change="bindPickerChange" :range="array">
				<view>
					<label class="pr38">{{array[indexw]}}</label>
					<image src="../../../static/tuo.png" mode=""
						style="width: 30upx;height: 30upx;padding-right: 0upx;"></image>
				</view>
			</picker>
		</view>
		<view class="list">
			<view class="items" style="display: flex;justify-content: flex-start;">
				<view class="list-z">
					<view class="" style="display: flex;justify-content: flex-start;">
						<text style="font-size: 26upx;color:#666666;">专业</text>
					</view>
					<view style="color: #333333;font-size: 30upx;">
						<input type="text" v-model="zhuanye" placeholder="请填写专业名字" style="font-size: 30upx;" />
					</view>
				</view>

			</view>
		</view>
		<view class="list">
			<view class="items" style="display: flex;justify-content: flex-start;" @click="openTime">
				<view class="list-z">
					<view class="" style="display: flex;justify-content: flex-start;">
						<text style="font-size: 26upx;color:#666666;">时间段</text>
					</view>
					<view style="color: #333333;font-size: 30upx;">
						<input type="text" placeholder="请选择时间段" style="font-size: 30upx;" v-if="startTime==''"
							disabled="false" />
						<text v-else>{{startTime}}年-{{endTime}}年</text>
					</view>
				</view>
				<image src="../../../static/tuo.png" mode="" style="width: 30upx;height: 30upx;padding-right: 0upx;">
				</image>
			</view>
		</view>
		<view
			style="display: flex;width: 100%;background-color: #fff;position: absolute;bottom: 0;height: 110upx;align-items: center;">
			<view class="shanchu" @click="shan">
				删除
			</view>
			<view class="baocun" @click="queding">
				保存
			</view>
		</view>
		<timeSlot ref="timeslot" :title="'选择时间段'" @confirm="confirmTime">
		</timeSlot>
	</view>
</template>

<script>
	import timeSlot from "@/components/wanghexu-timeslot/wanghexu-timeslot.vue"
	export default {
		data() {
			return {
				xuexiao: '',
				array: ['选择学历'],
				indexw: 0,
				edu_id: '',
				zhuanye: '',
				startTime: '',
				endTime: '',
				edu_name: '',
				jiaoinfo: {},
				useid: ''
			}
		},
		onLoad(option) {
			this.useid = option.useid
			this.jiaoinfo = JSON.parse(option.sjan)
			console.log(this.jiaoinfo, "6666")
			if (option.xuexiao) {
				this.xuexiao = option.xuexiao
				this.array[this.indexw] = this.jiaoinfo.level
				this.edu_name = this.jiaoinfo.level
				this.zhuanye = this.jiaoinfo.professional
				this.startTime = this.jiaoinfo.start_time
				this.endTime = this.jiaoinfo.end_time
			} else {
				this.xuexiao = this.jiaoinfo.edu_name
				this.edu_name = this.jiaoinfo.level
				this.array[this.indexw] = this.jiaoinfo.level
				this.zhuanye = this.jiaoinfo.professional
				this.startTime = this.jiaoinfo.start_time
				this.endTime = this.jiaoinfo.end_time
			}
			uni.request({
				url: 'https://dsx.cdzer.com/api/Job/geteducation', //仅为示例，并非真实接口地址。
				method: 'POST',
				header: {
					'content-type': 'application/x-www-form-urlencoded',
				},
				success: (res) => {
					console.log(res, "学历列表")
					this.xuelist = res.data.data
					res.data.data.forEach(item => {
						this.array.push(item.cate_name)
					})
				}
			});
		},
		components: {
			timeSlot
		},
		methods: {
			back() {
				uni.redirectTo({
					url: `./index?useid=${this.useid}`
				})
			},
			shan(){
				var that = this
				this.Loop = setTimeout(function() {
				
					uni.showModal({
						title: '提示',
						content: '确定删除该工作经历吗？',
						success: function(res) {
							if (res.confirm) {
								that.chule()
							} else if (res.cancel) {
								console.log('用户点击取消');
							}
				
						}
					});
				}.bind(this), 100);
				
				
			},
			chule(){
				this.$http.deljiaoyu({
						edu_id:this.jiaoinfo.id,
					}).then(res => {
						console.log(res.status)
						if(res.status == 200 ){
							uni.showToast({
								title:'删除成功',
								icon:'none'
							})
							setTimeout(()=>{
								uni.navigateTo({
									url:`./index?useid=${this.useid}`
								})
							},1100)
						}else{
							uni.showToast({
								title:res.mess,
								icon:'none'
							})
						}
					})
			},
			queding() {
				const data = {
					edu_name: this.xuexiao,
					start_time: this.startTime,
					end_time: this.endTime,
					id:this.jiaoinfo.id,
					level: this.edu_name,
					professional: this.zhuanye
				};
				this.$http.updatejy(data).then(res => {

					if (res.status == 200) {
						console.log(res, "保存资料")
						this.$hideLoading()
						uni.showToast({
							title: res.mess
						})
						setTimeout(() => {	
							uni.redirectTo({
								url: `./index?useid=${this.useid}`
							})
						}, 1200)
					} else {
						uni.showToast({
							title: res.mess,
							icon: 'none'
						})
					}
				})
			},
			confirmTime(e) {
				console.log(e.end.hour, e.start.hour)
				this.endTime = e.end.hour
				this.startTime = e.start.hour
			},
			openTime() {
				this.$refs.timeslot.open()
			},
			bindPickerChange: function(e) { //改变的事件名
				this.indexw = e.target.value //将数组改变索引赋给定义的index变量
				this.edu_id = this.xuelist[this.indexw - 1].id
				this.edu_name = this.xuelist[this.indexw - 1].cate_name
				console.log(this.edu_id, "选择学历")
			},
			toxuexiao() {
				var sjan = JSON.stringify(this.jiaoinfo)
				uni.navigateTo({
					url: `./byxx?useid=${this.useid}&sjan=${sjan}`
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.shanchu {
		width: 140upx;
		height: 84upx;
		background: #F5F5F5;
		border-radius: 10upx;
		margin: 0 auto;
		text-align: center;
		line-height: 84upx;
		border-radius: 5upx;
		color: #333;
	}

	.baocun {
		width: 520upx;
		height: 84upx;
		background: #FF3D3D;
		border-radius: 10upx;
		margin: 0 auto;
		text-align: center;
		line-height: 84upx;
		color: #FFFFFF;
	}

	.header {
		position: fixed;
		background-color: #fff;
		height: 110upx;
		width: 100%;
		top: 0;
		left: 0;
		display: flex;
		z-index: 100;
		align-items: center;
		padding-left: 30upx;
	}

	.list {
		display: flex;
		flex-direction: column;
		padding: 30upx;
		justify-content: center;
		border-bottom: 2upx solid #EEEEEE;

		.list-z {
			display: flex;
			flex-direction: column;

			.tou {
				font-size: 36upx;
				color: 333333;
				font-weight: 550;
			}
		}

		view {
			padding-top: 5upx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
			color: #000;
		}
	}
</style>
